<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      //   let a = () => {
      //     setTimeout(() => {
      //       console.log("任务队列函数1");
      //     }, 0);
      //     for (let i = 0; i < 5000; i++) {
      //       console.log("a的for循环");
      //     }
      //     console.log("a事件执行完");
      //   };
      //   let b = () => {
      //     setTimeout(() => {
      //       console.log("任务队列函数2");
      //     }, 0);
      //     for (let i = 0; i < 5000; i++) {
      //       console.log("b的for循环");
      //     }
      //     console.log("b事件执行完");
      //   };
      //   let c = () => {
      //     setTimeout(() => {
      //       console.log("任务队列函数3");
      //     }, 0);
      //     for (let i = 0; i < 5000; i++) {
      //       console.log("c的for循环");
      //     }
      //     console.log("c事件执行完");
      //   };
      //   a();
      //   b();
      //   c();
      // 当a、b、c函数都执行完成之后，三个setTimeout才会依次执行

      // 执行顺序问题，考察频率挺高的，先自己想答案**
      //   setTimeout(function () {
      //     console.log(1);
      //   });
      //   new Promise(function (resolve, reject) {
      //     console.log(2);
      //     resolve(3);
      //   }).then(function (val) {
      //     console.log(val);
      //   });
      //   console.log(4);

      // function test() {
      //   console.log(1);
      //   Promise.resolve().then(function () {
      //     console.log(2);
      //   });
      // }

      // setTimeout(function () {
      //   console.log(3);
      //   Promise.resolve().then(test);
      // });

      // Promise.resolve().then(function () {
      //   console.log(4);
      //   setTimeout(() => {
      //     console.log(5);
      //   });
      // });

      // console.log(6);

      function fn() {
        console.log("fn");
        new Promise((resolve, reject) => {
          console.log(1);
          resolve(2);
        })
          .then((res) => {
            console.log(res);
          })
          .then(() => {
            console.log(3);
            setTimeout(() => {
              console.log("s1"); // 秒数相同，此处压到宏任务队列末尾
            }, 600);
          })
          .then(() => {
            console.log(4);
          });
      }

      new Promise((resolve) => {
        console.log(5);
        resolve(6);
      }).then((res) => {
        console.log(res);
        new Promise((resolve) => {
          resolve(7);
        }).then((res) => {
          console.log(res);
        });
      });

      setTimeout(() => {
        console.log("s2 ");
      }, 600);

      fn();

      console.log(8);
    </script>
  </body>
</html>
